<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户管理的修改页面</title>
    <link rel="stylesheet" href="../plugins/layui/css/layui.css">
    <script src="../plugins/layui/layui.js"></script>
    <script src="../js/cookie.js"></script>
</head>
<body>
<fieldset class="layui-elem-field layui-field-title">
    <legend>修改用户</legend>
</fieldset>
<form class="layui-form layui-form-pane" lay-filter="myForm" action="">
    <div class="layui-form-item">
        <label class="layui-form-label">用户名</label>
        <div class="layui-input-block">
            <input type="text" name="username" lay-verify="required" placeholder="用户账号"
                   autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">所属部门</label>
        <div class="layui-input-block">
            <select name="deptName" lay-filter="deptName">
                <option value=""></option>
                <option value="测试部门">测试部门</option>
                <option value="开发部门">开发部门</option>
                <option value="运维部门">运维部门</option>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">密码</label>
        <div class="layui-input-block">
            <input type="password" name="pwd" lay-verify="required" placeholder="密码"
                   autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">邮箱</label>
        <div class="layui-input-block">
            <input type="text" name="email" lay-verify="email" placeholder="邮箱"
                   autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">手机号</label>
        <div class="layui-input-block">
            <input type="text" name="tel" lay-verify="tel" placeholder="手机号"
                   autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">角色</label>
        <div class="layui-input-block">
            <input type="checkbox" name="roleName" value="学生" lay-skin="primary" title="学生">
            <input type="checkbox" name="roleName" value="教师" lay-skin="primary" title="教师">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">状态</label>
        <div class="layui-input-block">
            <input type="radio" name="status" value="1" title="正常">
            <input type="radio" name="status" value="0" title="禁用">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="confirmBtn">确定</button>
            <button type="button" class="layui-btn layui-btn-primary" id="back">返回</button>
        </div>
    </div>
</form>
<!--分享链接有关于HTML静态页面传值方法：
  https://www.cnblogs.com/EdwinChan/p/6387056.html?utm_source=itdadao&utm_medium=referral
-->
<script>



    layui.use(['form','layer'],function(){
        var form=layui.form,
            $=layui.jquery,
            layer=layui.layer;
        $('#back').click(function(){
            //history.back(-1);
            window.location.href='user.html';
        });
        form.on('submit(confirmBtn)',function(data) {
            console.log(data);
            //将新增的用户信息提交到后台
            var url=baseURL+'/UserServlet?action=insert';
            //切记传递到后台是data.field
            console.log(data.field);
            $.post(url,data.field,function(d) {
                if(d.indexOf('成功')!=-1) {
                    layer.alert(d,function(){
                        window.location.href="user.html";
                    });
                } else {
                    layer.msg(d);
                }
            });
            return false;
        });

    });

    layui.use(['form'],function(){
        var form=layui.form,
            $=layui.jquery;
        //2.如果是H5离线存储
        //var param = JSON.parse(localStorage['param']);
        //3.如果是Cookie传值
        var param=JSON.parse(getCookie("param"));
        console.log(param);
        var data=param[0];
        for(var key in data){
            var selector='[name='+key+']';
            if(key=='status' || key=='roleName') { //单选框动态赋值
                $(selector).each(function(i,item) {
                    if($(item).val() == data[key]) {
                        $(item).attr('checked', true);
                    }
                });
            } else
                $(selector).val(data[key]);
        }
        form.render();//渲染更新全部
    });
</script>
</body>
</html>